<template>
  <view>
    <view class="setting">
      <img src="../../static/logo.png" style="width:120px;height:120px"/>
    </view>
    <u-cell icon="info-circle" title="版本更新" value="1.0.1" is-link/>
    <u-cell icon="question" title="夜间模式">
      <template #value>
        <u-switch v-model="isNight" @change="change"/>
      </template>
    </u-cell>
    <view style="margin: 80px 20px;">
      <u-button type="primary" shape="circle" size="large" @click="loginOut">退出登录</u-button>
    </view>
  </view>

</template>

<script>
export default {
  name: 'UserSetting',
  data() {
    return {
      theme: uni.getSystemInfoSync().theme,
      isNight: this.$store.sysConfigStore.isNight,
      state: false
    }
  },
  onLoad() {
    this.setUIStyle('light')
    uni.onThemeChange(({
      theme
    }) => {
      console.log('onThemeChange', theme)
      this.theme = theme
    })
  },
  methods: {
    change() {
      // app可以实现暗黑模式
      this.state = !this.state
      if (this.state === false) {
        this.setUIStyle('light')
      } else if (this.state === true) {
        this.setUIStyle('dark')
      }
      this.$store.sysConfigStore.toggleNight()
    },
    // setUIStyle(style) {
    //   plus.nativeUI.setUIStyle(style)
    // },
    loginOut() {
      uni.setStorageSync('key', undefined)
      uni.navigateTo({
        url: '/pages/loginPage/loginPage'
      })
    }
  }

}
</script>

<style scoped>
.setting {
  margin: 50px auto;
  text-align: center;
}

</style>
